import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:image_cropper/image_cropper.dart';
import 'dart:io';

void main() {
  runApp(Setting());
}

class Setting extends StatefulWidget {
  const Setting({Key? key}) : super(key: key);

  @override
  State<Setting> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<Setting> {
  final ImagePicker _imagePicker = ImagePicker();
  File? _image;
  bool _isEditing = false; // 新增一个变量用于追踪编辑状态

  Future<void> _pickImage() async {
    final XFile? pickedFile =
        await _imagePicker.pickImage(source: ImageSource.gallery);
    if (pickedFile != null) {
      print("Selected image path: ${pickedFile.path}");
    }
  }

  Future<void> _getImage() async {
    final croppedImage = await ImageSelector.selectAndCropImage();

    if (croppedImage != null) {
      setState(() {
        _image = croppedImage;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          children: [
            Container(
              height: MediaQuery.of(context).size.height / 9,
              color: Color.fromARGB(255, 179, 202, 193),
              child: Align(
                alignment: Alignment(0, 0.5),
                child: Text(
                  '设置',
                  style: TextStyle(
                    color: Colors.black,
                    fontSize: 27,
                    fontWeight: FontWeight.normal,
                  ),
                ),
              ),
            ),
            Expanded(
              child: Container(
                color: Color.fromARGB(164, 212, 211, 211),
                child: Stack(
                  children: [
                    Positioned(
                      left: 20,
                      top: MediaQuery.of(context).size.height / 13,
                      child: GestureDetector(
                        onTap: _getImage,
                        child: CircleAvatar(
                          radius: 60,
                          backgroundImage:
                              _image != null ? FileImage(_image!) : null,
                          child: _image == null
                              ? const Icon(
                                  Icons.person,
                                  size: 60,
                                  color: Colors.white,
                                )
                              : null,
                        ),
                      ),
                    ),
                    Positioned(
                      right: 80,
                      top: MediaQuery.of(context).size.height / 13,
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.end,
                        children: [
                          ElevatedButton(
                            onPressed: () {
                              setState(() {
                                _isEditing = !_isEditing; // 切换编辑状态
                              });
                            },
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Colors.white,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(20),
                              ),
                              fixedSize: Size(100, 40),
                            ),
                            child: Text(
                              _isEditing ? '完成' : '编辑资料', // 根据编辑状态显示不同的文本
                              style: TextStyle(
                                color: Colors.black,
                                fontSize: 16,
                              ),
                            ),
                          ),
                          SizedBox(height: 25),
                          ElevatedButton(
                            onPressed: _getImage,
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Colors.white,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(20),
                              ),
                              fixedSize: Size(100, 40),
                            ),
                            child: Text(
                              '更换头像',
                              style: TextStyle(
                                color: Colors.black,
                                fontSize: 16,
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Positioned(
                      top: MediaQuery.of(context).size.height / 3 - 25,
                      left: 16,
                      right: 16,
                      child: Column(
                        children: [
                          _buildTextWithInput("姓名"),
                          SizedBox(height: 15),
                          _buildTextWithInput("学号"),
                          SizedBox(height: 15),
                          _buildTextWithInput("手机号"),
                        ],
                      ),
                    ),
                    Positioned(
                      top: MediaQuery.of(context).size.height / 3 + 280,
                      left: MediaQuery.of(context).size.width / 2 - 80,
                      child: ElevatedButton(
                        onPressed: () {
                          // Handle "退出登录" button press
                        },
                        style: ElevatedButton.styleFrom(
                          primary: Colors.white,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(10),
                          ),
                          fixedSize: Size(160, 40),
                        ),
                        child: Text(
                          '退出登录',
                          style: TextStyle(
                            color: Colors.black,
                            fontSize: 18,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildTextWithInput(String labelText) {
    return Row(
      children: [
        Container(
          width: 90,
          height: 50,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(10),
          ),
          child: Center(
            child: Text(
              labelText,
              style: TextStyle(
                color: Colors.black,
                fontSize: 16,
              ),
            ),
          ),
        ),
        SizedBox(width: 10),
        Expanded(
          child: Container(
            height: 50,
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(10),
            ),
            child: Center(
              child: TextFormField(
                enabled: _isEditing, // 使用变量来决定是否可编辑
                decoration: InputDecoration(
                  border: InputBorder.none,
                  hintText: 'Enter text',
                ),
                style: TextStyle(
                  color: Colors.black,
                  fontSize: 16,
                ),
              ),
            ),
          ),
        ),
      ],
    );
  }
}

class ImageSelector {
  static Future<File?> selectAndCropImage() async {
    final picker = ImagePicker();
    final pickedFile = await picker.pickImage(source: ImageSource.gallery);

    if (pickedFile != null) {
      final imageCropper = ImageCropper();
      final croppedImage = await imageCropper.cropImage(
        sourcePath: pickedFile.path,
        aspectRatioPresets: [CropAspectRatioPreset.square],
        androidUiSettings: AndroidUiSettings(
          toolbarTitle: '裁剪',
          toolbarColor: Colors.blue,
          toolbarWidgetColor: Colors.white,
          initAspectRatio: CropAspectRatioPreset.square,
          lockAspectRatio: true,
        ),
        iosUiSettings: IOSUiSettings(
          title: '裁剪',
        ),
      );

      return croppedImage;
    }

    return null;
  }
}
